<template>
	<view class="zh-go-top" @click="go">
		<text>返回顶部</text>
	</view>
</template>

<script>
	export default {
		methods: {
			// 返回页面顶部
			go() {
				//滚动到页面顶部-uni-app 官方提供的API
				uni.pageScrollTo({
					scrollTop: 0,
					//滚动到距离顶部的位置
					duration: 100, //滚动动画耗时多少毫秒
				})
			}
		}
	}
</script>
<!-- scoped:局部作用域的样式-->
<!-- Lang: language, 指定预编译样式语言 -->

<style scoped lang="scss">
	// 固定到页面右下角
	.zh-go-top {
		position: fixed;
		right: 20rpx;
		bottom: 180rpx;
		width: 110rpx;
		height: 110rpx;
		background-color: #fff;
		border: 1rpx solid #aaa;
		border-radius: 50%;
		text-align: center;
		opacity: .5;
		font-size: 38rpx;

		// 激活
		&:active {
			//scss中的&表示"当前元素"
			opacity: 1;
		}
	}
</style>
